import React from 'react';
import { Radio } from 'antd';
import FormItem from 'antd/lib/form/FormItem';
import DragContainer from 'src/pages/AnalyseManage/EditReport/components/EditorDataType/Drag/DragContainer';
import { WD_CODE, DL_CODE } from 'src/pages/AnalyseManage/EditReport/components/EditorDataType/EnumConfig';

interface IProps {
	config: any;
	onValuesChange: ( chartType: string, key: string, values: Object, configType: string ) => void;
	form: any;
	dragOver: ( value: string ) => void;
	currentDragNode: any;
}

const LineDataType = ( props: IProps ) => {
	const { config, onValuesChange, form, dragOver, currentDragNode } = props;
	return (
		<>
			<FormItem label="类型" name="lineType">
				<Radio.Group>
					<Radio value="basic">基础折线图</Radio>
					<Radio value="dataPoints">带数据点的折线图</Radio>
				</Radio.Group>
			</FormItem>

			<FormItem label="X轴/类别轴" name='chartLineXColumns'>
				<DragContainer
					form={ form }
					name='chartLineXColumns'
					tip='拖入维度'
					type={ WD_CODE }
					config={ config }
					dragOver={ dragOver }
					currentDragNode={ currentDragNode }
					onValuesChange={ onValuesChange }
				></DragContainer>
			</FormItem>

			<FormItem label="Y轴/值轴" name='chartLineYColumns'>
				<DragContainer
					form={ form }
					name='chartLineYColumns'
					tip='拖入度量'
					type={ DL_CODE }
					config={ config }
					dragOver={ dragOver }
					currentDragNode={ currentDragNode }
					onValuesChange={ onValuesChange }
				></DragContainer>
			</FormItem>
			<FormItem label="图例颜色" name='chartLineColorColumns'>
				<DragContainer
					form={ form }
					name='chartLineColorColumns'
					tip='拖入维度'
					type={ WD_CODE }
					config={ config }
					dragOver={ dragOver }
					currentDragNode={ currentDragNode }
					onValuesChange={ onValuesChange }
				></DragContainer>
			</FormItem>
			{/* <FormItem label="针对此图表的数据筛选" name='chartLineFilterColumns'>
				<DragContainer
					form={ form }
					name='chartLineColorColumns'
					tip='拖入维度'
					type={ WD_CODE }
					config={ config }
					dragOver={ dragOver }
					currentDragNode={ currentDragNode }
					onValuesChange={ onValuesChange }
				></DragContainer>
			</FormItem> */}
		</>
	);
};

export default React.memo( LineDataType );
